import { defineStore } from 'pinia'
import { ref, computed } from 'vue'

/**
 * 参数1：仓库的名字
 * 参数2：箭头函数，里面写组合式API
 * 参数3：持久化
 *
 * 这种定义方式叫做 Setup Store，它里面的语法是组合式的API
 */
export const useCounter2Store = defineStore(
  'counter2',
  () => {
    // state
    const count = ref(100)
    const xxx = ref(200)

    // gettes
    const squareCount = computed(() => {
      return count.value * count.value
    })

    // actions
    const add = (val: number) => {
      count.value += val
      xxx.value += val
    }

    // actions
    const asyncAdd = (val: number) => {
      setTimeout(() => {
        count.value += val
      }, 1000)
    }

    return {
      count,
      squareCount,
      add,
      asyncAdd
    }
  },
  {
    // persist: true
    persist: {
      key: 'mycounter2', // 存储的key
      storage: window.sessionStorage, // 存储到哪里
      paths: ['count'] // 对什么模型数据进行存储
    }
  }
)
